import {AiOutlineInstagram,AiOutlineTwitter,AiOutlineWeibo} from "react-icons/ai"
import {FaWeixin,FaTiktok} from "react-icons/fa"
import { Link } from "react-router-dom";

const Footer = () =>{
    return (
        <div className="px-20">
            <div className="flex 
                    justify-center 
                    border-b-[1px]
                    pb-10
                    ">
                <div className="w-1/4 font-bold text-3xl italic">Faway</div>
                <div className="flex justify-center items-center">
                    <ul className="flex justify-center items-center w-1/2 flex-wrap">
                        <li className="mx-6 my-2 font-bold">关于我们</li>
                        <li className="mx-6 my-2 font-bold">服务支持</li>
                        <li className="mx-6 my-2 font-bold">友情链接</li>
                        <li className="mx-6 my-2">常见问题</li>
                        <li className="mx-6 my-2">旅行社区</li>
                        <li className="mx-6 my-2">联系我们</li>
                        <li className="mx-6 my-2">客服中心</li>
                        <li className="mx-6 my-2">旅行攻略</li>
                        <li className="mx-6 my-2">企业文化</li>
                    </ul>
                </div>
                <div className="w-1/4 flex flex-col items-start">
                    <div className="font-bold">关注我们</div>
                    <div>
                        <ul className="flex justify-center items-center mt-1">
                            <li className="pr-2 transition hover:-translate-y-1"><Link to='/'><AiOutlineInstagram size={24}/></Link></li>
                            <li className="pr-2 transition hover:-translate-y-1"><Link to='/'><AiOutlineTwitter size={24}/></Link></li>
                            <li className="pr-2 transition hover:-translate-y-1"><Link to='/'><FaWeixin size={24}/></Link></li>
                            <li className="pr-2 transition hover:-translate-y-1"><Link to='/'><AiOutlineWeibo size={24}/></Link></li>
                            <li className="pr-2 transition hover:-translate-y-1"><Link to='/'><FaTiktok size={24}/></Link></li>
                        </ul>
                    </div>
                </div>

                </div>
                <div className="flex items-center justify-between pt-4">
                   <div>&copy;2023产品版权所有，保留所有权利</div>
                    <div>
                        <ul className="flex items-center">
                            <li className="px-1"><Link to='/pricy'>隐私政策</Link></li>
                            <li className="px-1"><Link to='service'>服务条款</Link></li>
                            <li className="px-1"><Link to="/">Cookie设置</Link></li>
                        </ul>
                    </div>
                    
                </div>
                <div className="pt-4"></div>
        </div>
    );
}
export default Footer;